import React from 'react'
import Index from '../Index'
import Found from '../Found'
import My from '../My'
import {Route,Redirect} from 'react-router-dom'
import { TabBar } from 'antd-mobile';
class Home extends React.Component {
    state = { 
        selectedTab: 'blueTab',
        hidden: false,
    }
    render() { 
        console.log(this.props);    
        return (
            <div>
            <div>
                <Route exact path='/home'><Redirect to='/home/index'></Redirect></Route>
                {/* <Route path='/home/index' component={Index}></Route> */}
                {/* <Route path='/home/found' component={Found}></Route> */}
                {/* <Route path='/home/my' component={My}></Route> */}
            </div>
            <div style={{ position: 'fixed', height: '100%', width: '100%', top: 0 }}>
        <TabBar
          unselectedTintColor="#949494"
          tintColor="#33A3F4"
          barTintColor="white"
          hidden={this.state.hidden}
        >
          <TabBar.Item
            title="首页"
            key="首页"
            icon={<i className='iconfont icon-ind'/>}
            selectedIcon={<i className='iconfont icon-ind'/>}
            selected={this.props.location.pathname==='/home/index'}
            onPress={() => {
             this.props.history.push('/home/index')
            }}
          >
             <Route path='/home/index' component={Index}></Route>
            {/* {this.renderContent('Life')} */}
          </TabBar.Item>
          <TabBar.Item
            icon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url(https://gw.alipayobjects.com/zos/rmsportal/BTSsmHkPsQSPTktcXyTV.svg) center center /  21px 21px no-repeat' }}
              />
            }
            selectedIcon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url(https://gw.alipayobjects.com/zos/rmsportal/ekLecvKBnRazVLXbWOnE.svg) center center /  21px 21px no-repeat' }}
              />
            }
            title="找房"
            key="找房"
            icon={<i className='iconfont icon-findHouse'/>}
            selectedIcon={<i className='iconfont icon-findHouse'/>}
            selected={this.props.location.pathname==='/home/found'}
            onPress={() => {
                this.props.history.push('/home/found')
               }}
          >
             <Route path='/home/found' component={Found}></Route>
          </TabBar.Item>
          <TabBar.Item
            icon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url(https://zos.alipayobjects.com/rmsportal/psUFoAMjkCcjqtUCNPxB.svg) center center /  21px 21px no-repeat' }}
              />
            }
            selectedIcon={
              <div style={{
                width: '22px',
                height: '22px',
                background: 'url(https://zos.alipayobjects.com/rmsportal/IIRLrXXrFAhXVdhMWgUI.svg) center center /  21px 21px no-repeat' }}
              />
            }
            title="我的"
            key="我的"
            icon={<i className='iconfont icon-my'/>}
            selectedIcon={<i className='iconfont icon-my'/>}
            selected={this.props.location.pathname==='/home/my'}
            onPress={() => {
                this.props.history.push('/home/my')
               }}
          >
            <Route path='/home/my' component={My}></Route>
          </TabBar.Item>
</TabBar>
      </div>
    
        </div>
        );
    }
}
 
export default Home;